<template>
	<view class="page-favorite content" :style="{ direction: $store.state.dir }">
		<view class="page-title h1">
			{{ $t('my-house.title') }}
		</view>
		<view class="house_num">
			<span>today Houses：{{todayHouses}}</span>
			<span>today Passed：{{todayPassed}}</span>
			<span>total Houses：{{totalHouses}}</span>
			<span>total Passed：{{totalPassed}}</span>
		</view>
			<u-tabs :list="navList" @click="handleChoose"></u-tabs>
		<view v-if="list.length > 0 || loadStatus == 'loading'" class="">
			<house-cell @update="loadData" v-for="item in list" :detail="item" :key="item.id"></house-cell>
		</view>
		<view v-else class="empty-wrapper flex-layout-col flex-center">
			<image style="height: 200px" src="../../static/list.png" mode="aspectFit"></image>
			<text style="font-size: 24px">{{ $t('nodata') }}</text>
			<text class="h3 gap-col-top2" style="text-align: center">{{ $t('text.empty.myhouse') }}</text>
		</view>
	</view>
</template>

<script>
	import {
		houseList,
		myHouselnfo
	} from '../../lib/service';
	export default {
		data() {
			return {
				currentPage: 0,
				pageSize: 100,
				loadStatus: 'loading',
				hasMore: false,
				list: [],
				todayHouses: 0,
				todayPassed: 0,
				totalHouses: 0,
				totalPassed: 0,
				auditStatus:1,
				navList:[{
					name:'audited',
					state:1
				},{
					name:'unaudited',
					state:0
				},{
					name:'rejected',
					state:2
				}]
			};
		},
		onShow() {
			this.handleInfo()
			this.currentPage = 0;
			this.loadData();
		},

		methods: {
			handleInfo() {
				myHouselnfo().then((res) => {
					if (res.statusCode == 0) {
						this.todayHouses = res.data.todayHouses;
						this.todayPassed = res.data.todayPassed;
						this.totalHouses = res.data.totalHouses;
						this.totalPassed = res.data.totalPassed;
					}
				}).catch((res) => {

				});
			},
			handleHomeButton() {
				uni.switchTab({
					url: '/pages/index/index'
				});
			},
			loadData() {
				if (!this.$store.state.user) {
					return false;
				}
				uni.showLoading();
				this.loadStatus = 'loading';
				this.currentPage = this.currentPage + 1;
				houseList({
						current: true,
						currentPage: this.currentPage,
						pageSize: this.pageSize,
						auditStatus:this.auditStatus
					})
					.then((res) => {
						uni.hideLoading();
						this.loadStatus = 'no-more';
						this.hasMore = res.data.hasMore;
						this.list = res.data.records;
					})
					.catch((res) => {
						this.loadStatus = 'no-more';
						uni.showToast({
							title: 'System Error'
						});
					});
			},
			handleChoose(e){
				console.log('index',e.state)
				this.auditStatus = e.state;
				this.loadStatus = 'loading';
				this.hasMore = false
				this.list = [];
				this.currentPage = 0;
				this.loadData()
				
			}
		}
	};
</script>

<style lang="scss">
	page {
		background-color: #f9fbff;
	}

	.empty-wrapper {
		height: 50vh;
	}

	.house_num {
		width: 100%;
		font-size: 24rpx;
		display: flex;
		align-items: center;
		justify-content: space-between;
		margin-bottom: 16rpx;
		flex-wrap: wrap;

		span {
			width: 50%;
			display: inline-block;
			margin-bottom: 16rpx;
		}
	}
</style>